import React, {Component} from "react";
import {observer, inject} from "mobx-react";
import {Route, withRouter, Switch} from "react-router-dom";
import { RouteLayout } from 'weaver-mobile-page'
import {Icon, Tools} from "weaver-mobile";
import RoomPlan from '../../components/roomPlan';
import RoomPlan2 from '../../components/roomPlan/roomDisplay2.js';

const getLabel = Tools.getLabel;

@inject("calendarStore")
@inject('viewMeetingStore')
@withRouter
@observer
export default class Report extends Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }
  toReport = (src) => {
    this.props.history.push(src)
  };

  getBasePath = () =>{
    const thisPath = this.props.history.location.pathname;
    if(thisPath=='/calendar/allMeeting/report'){
        window.em&&window.em.checkJsApi('changeTitle') && window.em.changeTitle({title:getLabel(15101, '报表')})
    }
    return thisPath
    // return thisPath.split('report')[0]
  }

  renderContent(list) {
      return (
          list.map((item, index) => (
              <div key={index} className='report-list-item'>
                  <div className='report-list-item-link' onClick={() => this.toReport(item.src)}>
                      <div className='report-list-item-content'>
                          <div>{item.title}</div>
                          <Icon className='report-list-item-icon' type='right'/>
                      </div>
                  </div>
              </div>
          ))
      )
  }

  render() {
    const basePath = this.getBasePath();
    let options = [
        {
            title: getLabel(15881, "会议室使用情况"),
            src: `${basePath}/roomPlan`
        }
    ];
    return (
        <div className='report-list'>
            {
                this.renderContent(options)
            }
            <Switch>
                <Route
                  key="roomPlan"
                  path="/calendar/*/roomPlan"
                  render={()=>(
                    <RouteLayout>
                    <div key="roomPlanDiv" className="wm-route-layout wm-demo-route-layout-page" style={{height: 'calc(100% - 51px)'}}>
                        {/* <RoomPlan from={'calendar'}  /> */}
                        <RoomPlan2 from={'calendar'}  />
                    </div>
                    </RouteLayout>
                  )}
                />
            </Switch>
        </div>
        )
    }
}
